import React from 'react';
import Index from "./layout/Index"
import Login from "./Login"
import { HashRouter,Routes,Route } from "react-router-dom";
import menus from './routers';

const App =() =>{

  // 创建路由
  const routeMap = (menus) =>{
    return menus.map((item)=>{
      if(item.children){
        // 有子路由
        return routeMap(item.children)
      }else{
        // 无子路由
        return <Route key={item.key} path={item.key} element={item.element}></Route>
      }
    })
  }


  return <>
   {/* 路由模式定义，Hash 模式 */}
    <HashRouter>
      {/* Routes 配置路由列表 */}
      <Routes>
        {/* 每一项路由的配置 */}
          <Route path="/" element={<Index />} >
            {routeMap(menus)}
          </Route>

          <Route path='login' element={<Login />} />

      </Routes>
    </HashRouter>
  </>
}
export default App